<template>
  <!--数字码收款确认页面-->
  <div class="shuzi">
    <p class="banner"><img src="../../../assets/banner.png" alt="" width="100%"></p>
    <wv-group>
      <wv-input label="数字码" placeholder="请输入对应服务二维码下的数字码" v-model="orderCode"></wv-input>
    </wv-group>
    <p class="tip">收款确认须知：要确认已收到会员支付的款项，才可进行收款确认呦</p>
    <p class="link" v-show="hidshow">
      <router-link to="/shoukuanjilu" tag="span">收款确认记录</router-link>
      <router-link to="/shoukuan" tag="span" class="saoyisao">扫一扫收款确认</router-link>
    </p>
    <wv-button type="primary" @click="goGatheringMoney" tag="p" class="offer">收款确认</wv-button>
  </div>
</template>

<script type="text/ecmascript-6">
  import {gathering_money} from '../../../../test/unit/http'
  import {Toast} from 'we-vue'

  export default {
    name: '',
    props: {},
    data() {
      return {
        orderCode: "",
        docmHeight: document.documentElement.clientHeight,  //默认屏幕高度
        showHeight: document.documentElement.clientHeight,   //实时屏幕高度
        hidshow: true  //显示或者隐藏footer
      };
    },
    methods: {
      goGatheringMoney() {
        if (this.$myUtils.isNull(this.orderCode)) {
          Toast.fail("数字码必填");
        } else {
          let params = {
            orderCode: this.orderCode,
          };
          gathering_money(params).then(res => {
            console.log(res);
            if (res.code === 100) {
              this.$router.push({name: 'confirmshoukuan', query: {orderId: res.object.orderId}});
            } else {
              Toast.fail(res.info);
            }
          })
        }
      }
    },
    created() {

    },
    mounted() {
      window.onresize = () => {
        return (() => {
          this.showHeight = document.body.clientHeight;
        })()
      }
    },
    watch: {
      showHeight: function () {
        if (this.docmHeight > this.showHeight) {
          this.hidshow = false
        } else {
          this.hidshow = true
        }
      }
    },
    components: {}
  }
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped lang="less" rel="stylesheet/less">
  .weui-cell {
    background-color: #eee;
    height: 48px;
    line-height: 48px;
    border-radius: 5px;
    width: 80%;
    margin: auto;
  }

  .tip {
    color: #111;
    font-weight: 700;
    margin-top: 10px;
    text-align: left;
    padding: 10px 19px;
  }

  .link {
    position: fixed;
    bottom: 90px;
    width: 100%;
    text-align: center;
    font-size: 13px;

    span:first-child {
      color: #999;
      margin-right: 20px;
    }

    .saoyisao {
      color: #f98e3c;
    }
  }

  .offer {
    position: fixed;
    bottom: 0;
    width: 100%;
    background-color: #f98e3c;
    height: 50px;
    line-height: 50px;
    color: #fff;
  }
</style>
